import { Card, Divider } from 'antd-mobile';
import { TCourse } from '@/utils/type';
// import Hr from '@/components/Hr';
import style from './index.module.less';

interface IProps {
  data: TCourse;
}
/**
 * 课程信息
 * @constructor
 */
const CourseInfo = ({ data }: IProps) => (
  <div className={style.container}>
    <Card title={data.cardName} className={style.card}>
      <div className={style.desc}>
        {data.desc}
      </div>
      {/* <Hr /> */}
      <div className={style.otherInfo}>
        <Divider contentPosition="left">预约课程</Divider>
        <div className={style.reserveInfo}>
          {data.reserveInfo}
        </div>
      </div>
      {/* <Hr /> */}
      <div className={style.otherInfo}>
        <Divider contentPosition="left">退款信息</Divider>
        <div className={style.reserveInfo}>
          {data.refundInfo}
        </div>
      </div>
      {/* <Hr /> */}
      <div className={style.otherInfo}>
        <Divider contentPosition="left">其他信息</Divider>
        <div className={style.reserveInfo}>
          {data.otherInfo}
        </div>
      </div>
    </Card>

    <div className={style.bottom} />
  </div>
);

export default CourseInfo;
